*{
    padding: 0;
    margin: auto;
}
html,body{
    height: 100%;
    width: 100%;

}

#Top{
    width: 100%;
    height: 70px;
    background-color: black;
}
#Toptext{
 
    width: 100%;
    height: 200px;
    background-image: url("http://i.gtimg.cn/qqlive/images/20170515/rank_bg.jpg");
    h1{
        position: relative;
        top: 12%;
    }
    p{
        position: relative;
        top: 20%;
    }
}
#allContain{
    border-radius: 40px;
    width: 100%;           
    p{
        margin-left: 5%;
        width: 90%;
        .bottomText{
            font-size: 1.1em;
            color: black;

        }
    }
    #containtext{
        z-index: 444;
        width: 70%;
        margin-left: 15%;
        ul{
            margin-top: 0.5%;
            width: 100%;
            height: 50px;
            padding: 0;
            margin: auto;
            list-style: none;
            li{
                color: #666;
                float: left;
                width: 12.5%;
                text-align: center;
                position: relative;
                top: 20%;
            }
            li:hover{
                color: #ff5c38;
            }
        }

    }
}
#containDetailed{
    margin-top: 1.5%;
    width: 100%;
    height: 100%;
    div{
        border-radius: 10px;
        div{
            div{
                margin-left: 2%;
                width: 100% ;
                height: 25%
           }
        }
    }
    #div:hover{
        background-color: rgb(246 246 246);
        transform: all .5s
    }

}



